<template>
  <div class="list">
    <ul>
      <li>
        <div class="lisTop">
          <div class="header">
            <img src="http://file.rzkeji.com/web/recruit/icon/me.png" class="headerImg"/>
            <img src="http://file.rzkeji.com/web/recruit/icon/me.png" class="sexImg"/>
          </div>
          <div class="details">
            <div class="details_top">
              <span>王先生</span>
              <span>27岁</span>
              <span>2分钟前</span>
            </div>
            <div class="details_center">
              <span>薪资面议</span>
              <span>5年以上</span>
              <span>高中</span>
            </div>
            <div class="details_bottom">
              <span>广东省广州市荔湾区</span>
              <span>技术部主管/经理</span>
            </div>
            <div class="details_speciality">
              <span>技术精悍</span>
              <span>沟通能力强</span>
              <span>经验丰富</span>
            </div>
          </div>
        </div>
        <div class="lisBottom"></div>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  methods:{
    
  }
}
</script>

<style scoped>
.list{width: 100%;margin-top: 20px;}
.list ul{width: 100%;}
.list ul li{width: 100%;height:142px;}
.lisTop{width: 330px;margin-left: 22.5px;display: flex;justify-content: row;}
.header{width: 64px;height: 102px;position: relative;}
.headerImg{width: 50px;height: 50px;position: absolute;left: 0;top: 0}
.sexImg{width: 10px;height: 10px;position: absolute;left: 40px;top: 0;}
.details{width: 266px;}
.details_top{width: 100%;}
.details_top span:nth-of-type(1){color: #333333;font-size: 17px;font-weight: bold;}
.details_top span:nth-of-type(2){color: #666;font-size: 13px;margin-left: 10px;}
.details_top span:nth-of-type(3){float: right;color: #999;font-size: 12px;}

.details_center{width: 100%;margin-top: 5px;}
.details_center span{color: #6a6a6a;font-size: 13px;margin-right: 10px;}

.details_bottom{width: 100%;margin-top: 5px;}
.details_bottom span{color: #7f7f7f;font-size:12px;margin-right: 10px;}
.details_speciality{width: 100%;margin-top: 7px;}
.details_speciality span{color: #3373ca;font-size: 12px;margin-left: 10px;}
</style>
